

<!DOCTYPE html><html><head><meta charset="utf-8"><link rel="Shortcut Icon" href="http://htmljs.b0.upaiyun.com//images/logo.ico?123"><link href="http://htmljs.b0.upaiyun.com//images/logo.ico?123" rel="shortcut icon" type="image/x-icon"><meta name="viewport" content="width=device-width, initial-scale=1, user-scalable = no"/>
<link href="http://htmljs.b0.upaiyun.com//images/icon.png" rel="apple-touch-icon"/>
<meta name="keywords" content="前端, 前端开发, web前端, web前端开发, 前端开发工程师, 前端开发攻城师,设计, 开发, 前端资源, CSS, JavaScript, Ajax, jQuery, html,html5,css3,浏览器兼容, 前端开发工具, 前端招聘, jQuery API, CSS整形和优化工具 , JS压缩工具 , JS格式化工具 , CSS参考手册 ,HTML参考手册 , 多重搜索 , nodejs , node , boostrap , sublime"/>
<script>if($.browser.msie){alert("请不要使用ie浏览本站！本站不支持ie10以下浏览器。")}</script><title>乱炖周刊第8期 - 每周为您推送本站精选的新鲜速递</title><base target="_blank"/><meta name="description" content="前端乱炖每周会为您推送本站精选的新鲜速递。">
<style>
img{
  max-width:100%;
}
p{
  margin:10px 0;
}
a{
  text-decoration: none;
  color:#56b38e;
}
html,body{margin:0;background: #fefefe;font-size: 14px;color:#444;}
*{
   font-family: "lucida grande", "lucida sans unicode", lucida, helvetica, "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;;
}
a:hover{
  text-decoration: underline;
}
@media screen and (min-width:100px) and (max-width:650px){
  table{
    width:100% !important;
  }
  body{
    margin:0 5px;
  }
  .wrapper,.tip,.title{width:100% !important;overflow: hidden;}
  #googlead{display: none !important;}
  #wx img{width:50%;}
  #WBCommentFrame{
    display: none;
  }
    .job .user{
        display:none !important;
    }
    .articles .title span{display:none !important;}
}
.job{background:#fff;overflow:hidden;}.job .title{background:#fff;padding:5px 10px;font-size:14px;line-height:30px;}
.job .title img{width:30px;height:30px;border-radius:50px;}
.job .title .headpic{float:right;}
.job .con{padding:10px;line-height:25px;background:#f7f7f7;}.job .con .item{margin-right:10px;display:inline-block;font-size:13px;}.job .con .item .key{color:#666;}
.job .con .item .value{color:#999;}
.job .con .count em{color:#999;margin-right:10px;}
.job .user .nick{float:left;font-size:14px;line-height:50px;margin:10px;}
</style>
</head>

<body>
  <div style="height:40px;background:#eee;color:#fff;line-height:40px;border-bottom:1px solid #ccc;margin:0 -5px;">
    <div style="width: 600px;margin:0 auto;" class="wrapper">
      <a href="http://www.html-js.com" style="color:#333;">前端乱炖官网</a>
      <a href="http://www.html-js.com/static/htmljs-weekly-7.html" style="padding:0 10px;color:#333;">上一期</a>
    </div>
  </div>
  <div id="newsletter" style="margin:0;padding:0; color: #333333; font: 13px/20px 'Helvetica Neue',Helvetica,Arial,Sans-serif;font-family:'Hiragino Sans GB','Microsoft YaHei','Helvetica Neue',Helvetica,Arial,sans-serif!important;overflow:hidden;" >
    <div class="wrapper" style="margin: 0px auto 0; width: 600px; padding-top:16px; padding-bottom:10px;">
      <div class="header clearfix" style="font-weight:bold;text-align:left;margin:10px 0;margin-top:20px;font-size:35px;color:#333;padding:0px;line-height: 43px;height:43px;">乱<img alt="炖" width="40" height="40" style="vertical-align: middle;margin-top:-8px;margin-left:5px;margin-right:5px;" src="http://htmljs.b0.upaiyun.com/uploads/1411395057234-%E6%9C%AA%E6%A0%87%E9%A2%98-4.png"/>周刊 第8期</div>
      <div style="color:#999;font-size:12px;padding-left:0px;line-height:45px;">主编：芋头</div>
      <a href="http://www.imooc.com/course/program?from=luandun" target="_blank" style="display:block;max-height:100px;"><img alt="畅谈“我与慕课网” IT好书随心选" src="http://htmljs.b0.upaiyun.com/uploads/1413253638826-600-100.gif" style="display:block;"/></a>
      <a href="http://www.html-js.com/topic/827" target="_blank">广告投放指南</a>
        <div style="">
        <div style="padding:0px;">
          <p style="font-size:13px;color:#666;">乱炖周刊 是 <a href="http://www.html-js.com" target="_blank">前端乱炖</a> 网站推出的前端技术信息推送产品。我们会每周为您提供最新最有含量的内容推送，如果您有兴趣，欢迎订阅周刊。
          </p>

        <div style="float:left;">
          <p style="font-size:14px;margin-top:20px;color:#489275;">推荐给朋友：</p>

            <p style="font-size:13px;">
                <a href="http://service.weibo.com/share/share.php?appkey=659341943&url=http://www.html-js.com/static/htmljs-weekly-8.html&pic=http://htmljs.b0.upaiyun.com/uploads/1413253874556-Snip20141014_10.png&title=《乱炖周刊》第8期新鲜出炉啦，《乱炖周刊》是@前端乱炖 网站推出的前端精品文章推送产品，每周为您多渠道推送营养文，前端必备，推荐订阅。戳右边查看在线版→_→" target="_blank" title="分享到微博"><img src="http://htmljs.b0.upaiyun.com/uploads/1393254783476-button1.png" style="width:110px;margin-left:-8px;margin-top:-3px;"/>
                </a>
            </p>
        </div>
        </div>
      </div>
    </div>
  </div>
  <div class="title" style="font-size:14px;margin: 0px auto 0; width: 600px; padding-top:0px; color:#333;border-bottom:1px solid #ddd;line-height:30px;margin-top:20px;padding-left:5px;color:#888;">前端乱炖·精品原创专栏</div>

  <div id="newsletter" >
      <div style="background: #f8f8db;font-size: 13px;width:600px;margin:0 auto;margin-top: 5px;color:#666;" class="tip"><div style="padding:10px;">每个乱炖专栏都是一系列原创文章的合集，我们希望能够提供一个展示和分享的平台，同时也让初学者能够系统学习前端知识。感谢每位作者的辛勤付出、无私奉献！</div></div>
  <div style="margin: 0px auto 0; width: 600px;"  class="wrapper">

    <div class="title" style="font-size:20px;line-height:30px;padding-top:20px;">
        <a href="http://www.html-js.com/article/column/668" style="color:#444;">前端开发面试题大集.avi（2）</a>
    </div>
    <div style="color:#777;font-size:13px;padding:0px;margin:10px 0;margin-top:5px;">这里将收集我做过的所有的前端面试笔试题，并根据自己的理解提供解答。将持续更新。

        欢迎拍砖，一起刷题，涨姿势，get技能。</div>
      <div class="title" style="font-size:20px;line-height:30px;padding-top:20px;">
          <a href="http://www.html-js.com/article/column/231" style="color:#444;">Regularjs: 中文指引（2）</a>
      </div>
      <div style="color:#777;font-size:13px;padding:0px;margin:10px 0;margin-top:5px;">Regularjs: 利用动态模板快速创建数据驱动的组件.作者的文章研究非常深入，值得一看。</div>
      <div class="title" style="font-size:20px;line-height:30px;padding-top:20px;">
          <a href="http://www.html-js.com/article/column/670" style="color:#444;">Gulp相关（2）</a>
      </div>
      <div style="color:#777;font-size:13px;padding:0px;margin:10px 0;margin-top:5px;">一些Gulp相关翻译和知识。</div>
      <div class="title" style="font-size:20px;line-height:30px;padding-top:20px;">
          <a href="http://www.html-js.com/article/column/98" style="color:#444;">My Code Wars 我的代码战争（6）</a>
      </div>
      <div style="color:#777;font-size:13px;padding:0px;margin:10px 0;margin-top:5px;">这里讲述的是一个8级（kyu）菜鸟立志成为8段（dan）大神的故事。

          他在代码战争中一次次遭遇挫败，而又在乱炖中获得高人指点。

          遥想当年自高自大，而今终知天外有天。

          坚持要走出一条自己的路，这是一条不归路。</div>
      <div class="title" style="font-size:20px;line-height:30px;padding-top:20px;">
          <a href="http://www.html-js.com/article/column/234" style="color:#444;">avalon学习教程（20）</a>
      </div>
      <div style="color:#777;font-size:13px;padding:0px;margin:10px 0;margin-top:5px;">从零开始学习到掌握当前国内最强大的MVVM框架avalon</div>
      <div class="title" style="font-size:20px;line-height:30px;padding-top:20px;">
          <a href="http://www.html-js.com/article/column/30" style="color:#444;">每天学点javascript（44）</a>
      </div>
      <div style="color:#777;font-size:13px;padding:0px;margin:10px 0;margin-top:5px;">javascript进阶级教程，循序渐进掌握javascript</div>

    <a href="http://www.html-js.com/article" style="line-height:30px;font-size:12px;color:#333;text-decoration:underline;">创建我自己的专栏</a>
  </div>
</div>
  <div class="title" style="font-size:14px;margin: 0px auto 0; width: 600px; padding-top:0px; color:#333;border-bottom:1px solid #ddd;line-height:30px;margin-top:20px;padding-left:5px;color:#888;">前端乱炖·精品站内原创文章</div>

  <div id="newsletter" >
  <div style="margin: 0px auto 0; width: 600px;padding-top:20px;" class="wrapper articles">

      <div class="title" style="font-size:14px;line-height:30px;padding-top:0px;">
          <a href="http://www.html-js.com/article/Regularjs-Chinese-guidelines-for-a-comprehensive-summary-of-the-front-template-technology" style="display:inline-block;width:450px;">
              [ 一个对前端模板技术的全面总结 ]
          </a>
          <span style="display:inline-block;font-size:14px;float:right;">  by 拴萝卜的棍子</span>
      </div>
      <div class="title" style="font-size:14px;line-height:30px;padding-top:0px;">
          <a href="http://www.html-js.com/article/A-day-to-learn-JavaScript-dont-know-Expressjs-settings" style="display:inline-block;width:450px;">
              [ 你不知道的Express.js设置 ]
          </a>
          <span style="display:inline-block;font-size:14px;float:right;">  by 张小俊128</span>
      </div>
      <div class="title" style="font-size:14px;line-height:30px;padding-top:0px;">
          <a href="http://www.html-js.com/article/The-frontend-development-interview-questions-a-large-set-ofAvi-web-frontend-development-test-of-CSS-part" style="display:inline-block;width:450px;">
              [ web前端开发测验之css部分 ]
          </a>
          <span style="display:inline-block;font-size:14px;float:right;">  by 臭臭手抽抽</span>
      </div>
      <div class="title" style="font-size:14px;line-height:30px;padding-top:0px;">
          <a href="http://www.html-js.com/article/HTML-front-end-development-interview-questions-a-large-set-ofAvi-web-frontend-development-test-part" style="display:inline-block;width:450px;">
              [ web前端开发测验之HTML部分 ]
          </a>
          <span style="display:inline-block;font-size:14px;float:right;">  by 臭臭手抽抽</span>
      </div>
      <div class="title" style="font-size:14px;line-height:30px;padding-top:0px;">
          <a href="http://www.html-js.com/article/Gulp-Gulp--related-project-vision-past-and-future" style="display:inline-block;width:450px;">
              [ Gulp -- 项目的愿景、过去和将来 ]
          </a>
          <span style="display:inline-block;font-size:14px;float:right;">  by 天镶</span>
      </div>
      <div class="title" style="font-size:14px;line-height:30px;padding-top:0px;">
          <a href="http://www.html-js.com/article/Slipjs-used-to-create-full-screen-slide-fast-Slipjs-mobile-phone-Webpage" style="display:inline-block;width:450px;">
              [ 使用Slip.js快速创建整屏滑动的手机网页 ]
          </a>
          <span style="display:inline-block;font-size:14px;float:right;">  by 老婆婆me</span>
      </div>
      <div class="title" style="font-size:14px;line-height:30px;padding-top:0px;">
          <a href="http://www.html-js.com/article/Laispace-translate-ES6-Generators-1-based-on-papers" style="display:inline-block;width:450px;">
              [ ES6 Generators（1）基础篇 ]
          </a>
          <span style="display:inline-block;font-size:14px;float:right;">  by 赖小赖小赖</span>
      </div>
      <div class="title" style="font-size:14px;line-height:30px;padding-top:0px;">
          <a href="http://www.html-js.com/article/Laispace-translate-ES6-Generators-2-indepth-article" style="display:inline-block;width:350px;">
              [ ES6 Generators（2）深入篇 ]
          </a>
          <span style="display:inline-block;font-size:14px;float:right;">  by 赖小赖小赖</span>
      </div>
      <div class="title" style="font-size:14px;line-height:30px;padding-top:0px;">
          <a href="http://www.html-js.com/article/Laispace-translate-ES6-Generators-3-of-asynchronous-discourse" style="display:inline-block;width:350px;">
              [ ES6 Generators（3）异步篇 ]
          </a>
          <span style="display:inline-block;font-size:14px;float:right;">  by 赖小赖小赖</span>
      </div>
  </div>
</div>
  <div class="title" style="font-size:14px;margin: 0px auto 0; width: 600px; padding-top:0px; color:#333;border-bottom:1px solid #ddd;line-height:30px;margin-top:20px;padding-left:5px;color:#888;">前端乱炖·招聘季</div>
  <div style="margin: 0px auto 0; width: 600px;padding-top:20px;" class="wrapper">
      <div class="job">
          <div class="title"><a href="/job/99" class="t">硅谷YC公司Strikingly诚招前端</a><a href="/user/3213" data-original-title="艾润在梦游" class="headpic user"><img src="http://tp2.sinaimg.cn/1776614945/50/5702517356/0"></a></div>
          <div class="con"><span class="item"><span class="key">公司：</span><span class="value">Strikingly</span></span><span class="item"><span class="key">招聘职位：</span><span class="value">前端工程师</span></span><span class="item"><span class="key">薪水范围：</span><span class="value">10000 - 20000</span></span>
              <div><span class="item"><span class="key">公司规模：</span><span class="value">10-20</span></span><span class="item"><span class="key">所在城市：</span><span class="value">市辖区</span></span><a href="/job/99/update?is_jian=1">推荐</a>
              </div>
          </div>
      </div>
      <div class="job">
          <div class="title"><a href="/job/98" class="t">【北京】诚聘node.js后端开发（15-25K，期权）</a><a href="/user/2881" data-original-title="lilyrose" class="headpic user"><img src="http://tp2.sinaimg.cn/1231036157/50/5669035993/0"></a></div>
          <div class="con"><span class="item"><span class="key">公司：</span><span class="value">光合新知（北京）科技有限公司</span></span><span class="item"><span class="key">招聘职位：</span><span class="value">node.js后端开发</span></span><span class="item"><span class="key">薪水范围：</span><span class="value">15000 - 25000</span></span>
              <div><span class="item"><span class="key">公司规模：</span><span class="value">30-50人</span></span><span class="item"><span class="key">所在城市：</span><span class="value">市辖区</span></span><a href="/job/98/update?is_jian=1">推荐</a>
              </div>
          </div>
      </div>
      <div class="job">
          <div class="title"><a href="/job/95" class="t">【北京】家装类创业项目招靠谱技术小伙伴，期待IOS\Android\前端\JAVA工程师和我们一起做点有趣的事儿！</a><a href="/user/35" data-original-title="想去_原野" class="headpic user"><img src="http://tp3.sinaimg.cn/1572546050/50/5664963381/1"></a></div>
          <div class="con"><span class="item"><span class="key">公司：</span><span class="value">北京久时花文化发展有限公司</span></span><span class="item"><span class="key">招聘职位：</span><span class="value">IOS\Android\前端\JAVA工程师</span></span><span class="item"><span class="key">薪水范围：</span><span class="value">7000 - 不限</span></span>
              <div><span class="item"><span class="key">公司规模：</span><span class="value">10人</span></span><span class="item"><span class="key">所在城市：</span><span class="value">市辖区</span></span><a href="/job/95/update?is_jian=1">推荐</a>
              </div>
          </div>
      </div>
      <div class="job">
          <div class="title"><a href="/job/94" class="t">[上海]挖财公司招聘前端工程师</a><a href="/user/3179" data-original-title="措上灰鸟" class="headpic user"><img src="http://tp3.sinaimg.cn/1183580734/50/40017449026/1"></a></div>
          <div class="con"><span class="item"><span class="key">公司：</span><span class="value">杭州财米科技有限公司</span></span><span class="item"><span class="key">招聘职位：</span><span class="value">高级/资深WEB前端工程师</span></span><span class="item"><span class="key">薪水范围：</span><span class="value">10000 - 20000</span></span>
              <div><span class="item"><span class="key">公司规模：</span><span class="value">100~500</span></span><span class="item"><span class="key">所在城市：</span><span class="value">市辖区</span></span><a href="/job/94/update?is_jian=1">推荐</a>
              </div>
          </div>
      </div>
      <div class="job">
          <div class="title"><a href="/job/93" class="t">在路上旅行App 招聘 web 前端开发工程</a><a href="/user/3125" data-original-title="carlxia" class="headpic user"><img src="http://tp4.sinaimg.cn/1840991347/50/1294584250/1"></a></div>
          <div class="con"><span class="item"><span class="key">公司：</span><span class="value">在路上</span></span><span class="item"><span class="key">招聘职位：</span><span class="value">web前端开发</span></span><span class="item"><span class="key">薪水范围：</span><span class="value">12000 - 20000</span></span>
              <div><span class="item"><span class="key">公司规模：</span><span class="value">100-150</span></span><span class="item"><span class="key">所在城市：</span><span class="value">市辖区</span></span><a href="/job/93/update?is_jian=0">no推荐</a>
              </div>
          </div>
      </div>
  </div>
  <div class="title" style="font-size:14px;margin: 0px auto 0; width: 600px; padding-top:0px; color:#333;border-bottom:1px solid #ddd;line-height:30px;margin-top:20px;padding-left:5px;color:#888;">前端乱炖·业内优秀文章精选</div>
<div id="newsletter" >
  <div style="margin: 0px auto 0; width: 600px;padding-top:20px;" class="wrapper">
    <div class="title" style="font-size:14px;line-height:30px;padding-top:0px;">
        <a style="font-size:14px;display:inline-block;width:450px;" href="http://t.cn/Rhizij6">
            Git工作流指南：Gitflow工作流
        </a>
    </div>
      <div class="title" style="font-size:14px;line-height:30px;padding-top:0px;">
          <a style="font-size:14px;display:inline-block;width:450px;" href="http://t.cn/R7hqHMw">
              不被重視的 HTML：Accessibility
          </a>
      </div>
      <div class="title" style="font-size:14px;line-height:30px;padding-top:0px;">
          <a style="font-size:14px;display:inline-block;width:450px;" href="http://t.cn/R77BIyT">
              WebGL开发入门
          </a>
      </div>
      <div class="title" style="font-size:14px;line-height:30px;padding-top:0px;">
          <a style="font-size:14px;display:inline-block;width:450px;" href="https://github.com/sofish/wechat.js/#readme">
              微信相关的 js 操作：分享、网络、菜单
          </a>
      </div>
      <div class="title" style="font-size:14px;line-height:30px;padding-top:0px;">
          <a style="font-size:14px;display:inline-block;width:450px;" href="http://t.cn/RPnFecn">
              那些相见恨晚的 JavaScript 技巧
          </a>
      </div>
      <div class="title" style="font-size:14px;line-height:30px;padding-top:0px;">
          <a style="font-size:14px;display:inline-block;width:450px;" href="http://weibo.com/1263362863/BrmNdquuA">
              网页重构的知识体系
          </a>
      </div>
      <div class="title" style="font-size:14px;line-height:30px;padding-top:0px;">
          <a style="font-size:14px;display:inline-block;width:450px;" href="http://t.cn/8kZGIbe">
              你若触发，我就处理——浅谈JavaScript的事件响应
          </a>
      </div>

  </div>
</div>
<div class="title" style="font-size:18px;font-weight:bold;margin: 0px auto 0; width: 600px; padding-top:0px; color:#333;border-left:4px solid #4e9d7e;margin-top:20px;padding-left:5px;line-height:20px;">微信公众号</div>
    <div style="margin: 0px auto 0; width: 600px;" class="wrapper">
      <img width="250" style="" src="http://htmljs.b0.upaiyun.com/uploads/1394040251862-qrcode.png"/>
      <div style="clear:both;"></div>
    </div>
  </div>
  <div style="font-size:18px;font-weight:bold;margin: 0px auto 0; width: 600px; padding-top:0px; color:#333;margin-top:20px;padding-left:5px;line-height:20px;" class="wrapper">
 <div style="background: none repeat scroll 0 0 #FFFFFF;  margin: 0px 0 0; padding: 20px 0;">
  <p class="title"  style="border-top:1px solid #ddd;font-size:12px;padding-top:10px;color:#999;"><a href="http://www.html-js.com">@前端乱炖 </a> 是一个功能丰富的提供高质量内容的技术社区</p>
     <p style="border-top:1px solid #ddd;font-size:12px;padding-top:10px;color:#999;" class="title" ><a href="http://www.html-js.com">行业合作请联系QQ：676588498 注明：乱炖合作</p>
<p style="border-top:1px solid #ddd;font-size:12px;padding-top:5px;color:#999;" class="title" >为了确保您能收到及时的通知，请将 postmaster@htmljs.sendcloud.org 添加为联系人。</p>

  </body>
</html>